<?php
/**
 * The template for displaying all pages.
 *
 * This is the template that displays all pages by default.
 * Please note that this is the WordPress construct of pages
 * and that other 'pages' on your WordPress site will use a
 * different template.
 *
 * @package WordPress
 * @subpackage Twenty_Eleven
 * @since Twenty Eleven 1.0
 */

get_header(); ?>

    	<div id="primary">
			<div id="content" role="main">
				<ul id="tips-flow">
				<?php while ( have_posts() ) : the_post(); ?>
					<li>
					
                    
						<article id="post-<?php the_ID(); ?>" <?php post_class(); ?>> 
							<?php
							// AnLTH - Start init the content variables
							// Use it to display on page.
							
							$the_title = get_the_title();
							$the_content = get_the_content();
							$the_tags = get_the_category();
							// $tip_link = get_category_link($the_tags[0]->term_id)."#post-".$post->ID; // Category name to Tag name, display it on top-left
							$the_tag = $the_tags[0]->name;
							$tip_link = get_post_permalink();
							
							$large_image_url = get_bloginfo('stylesheet_directory')."/images/home-default-image.png";
							if ( has_post_thumbnail()) {
								$large_image_urls = wp_get_attachment_image_src( get_post_thumbnail_id(), 'home-thumb');
								$large_image_url = $large_image_urls[0];
							}
													
							// Sample
							
							//echo $the_content;
							//echo $the_tag;
							//echo "<img src='".$large_image_url."' />";
							//echo "<a href='".$tip_link."' />URL</a>";
							//print_r($post);
							?>
							<img class="wp-post-image" src="<?php echo $large_image_url; ?>" alt="<?php echo $the_title; ?>"/>
							<h1><?php echo $the_title; ?></h1>
							
						</article>
						<div class="tag-mask"><span class="rotate_45"><?php echo $the_tag;  ?></span></div>
						<a class="read-more-btn" href="<?php echo $tip_link; ?> ">
							<img src="<?php bloginfo('stylesheet_directory') ?>/images/plus-btn.gif" alt="Read more ..."/>
						</a>
					</li>
				<?php endwhile; // end of the loop. ?>
				</ul>
			</div><!-- #content -->
		</div><!-- #primary -->
<?php get_sidebar(); ?>
<?php get_footer(); ?>